import { defineComponent } from "vue";
import Module from "@/views/dashboard/data/components/Module";
import icon from "./assets/4346.webp";

export default defineComponent({
	name: "GlobalDevelop",
	setup() {
		return () => (
			<Module title={"全球发展"}>
				<div class={"w-full h-[150px] flex flex-col relative px-4 box-border"}>
					<img class={"absolute m-auto left-0 right-0 bottom-0 h-[120px] w-3/5"} src={icon}></img>
					<div class={"flex flex-col absolute h-fit w-full m-auto left-0  bottom-0 top-0"}>
						<div>合作客户</div>
						<div class={"flex flex-row items-center mt-2"}>
							<div class={"text-[22px] text-[#1EB8FF] leading-[22px]"}>2698</div>
							<div class={"text-[13px] leading-[13px] h-[13px]"}>个</div>
						</div>
					</div>
					<div class={"flex flex-col absolute h-fit w-fit m-auto right-0  bottom-0 top-0"}>
						<div>国外安装设备</div>
						<div class={"flex flex-row items-center mt-2"}>
							<div class={"text-[22px] text-[#1EB8FF] leading-[22px]"}>568920</div>
							<div class={"text-[13px] leading-[13px] h-[13px]"}>台</div>
						</div>
					</div>
					<div class={"text-[36px] font-bold absolute h-fit w-fit m-auto left-0 right-0 bottom-0 top-0"}>80</div>
					<div class={"text-[13px] font-bold absolute h-fit w-fit m-auto left-0 right-0 bottom-0 "}>发展国家和地区</div>
				</div>
			</Module>
		);
	}
});
